<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
    	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	    <title>打包统计</title>
	    <meta name="description" content="防伪溯源">
	    <link rel="stylesheet" href="css/AllStyle.css" />
	    <link rel="stylesheet" href="css/iconfont.css" />
	    <script type="text/javascript" src="js/common.js" ></script>
	    <script type="text/javascript" src="js/companydata.js" ></script>
	    <script type="text/javascript" src="js/data.js" ></script>
	    <script type="text/javascript" src="js/tmpl.js" ></script>
	    <style>
	    .StockNav ul{
	        padding:2px 0;
	    }
	    .StockNav li:nth-child(2){
            width: 66%;
            white-space: nowrap;
	    }
	    </style>
	</head>
	<body>
		<!-- 页头 -->
	    <section>
		    <script type="text/javascript">
		        AllPageHeader();
		    </script>
	    </section>
	    
	    <!-- 页面  -->
	    <section class="AllContent" id="AllContent" style="background-color: #fff;">
	    	
	    	<img id="LoadingImg" style="width: 40%;margin:20px auto;display:block;" src="images/loading5.gif" />
	    	
	    	<div style="width:100%;height:300px;overflow-x: hidden;overflow-y: hidden;margin-top:-20px;"><div id="main" style="position:relative;width:100%;min-width:100%;height:300px;"></div></div>
            <div class="text-center">打包箱数：<span id="pack_total">0</span></div>
    		<!-- 信息 -->
			<div class="dataNav">
				<ul>
					<li style="width:35%">箱码编号</li>
					<li style="width:20%">数量</li>
					<li style="width:43%">打包时间</li>
				</ul>
			</div>
				
			<div id="datalist">

            </div>
	    	
	    </section>
	    <section class="eject">
	    	<div class="shadeBack"></div>
	    	<div class="shadConten"  style="top:10%;max-height:80%;overflow:auto;">
	    	    <p>
	    	            <span class="querytitle">箱码详情</span>
		        		<span class="queryexit"><img src="images/remove1.png"></span>
	    	    </p>
    			<section class="sc_block">
    				
    			</section>
	    	</div>
	    </section>
	</body>
	<script type="text/javascript" src="js/jquery.min.js" ></script>
	<script type="text/javascript" src="js/mui.min.js" ></script>
	<script type="text/javascript" src="js/echarts.min.js" ></script>
	<script type="text/javascript" src="cordova.js" ></script>
	<script type="text/javascript">

        function GetDateStr(AddDayCount) {
            var dd = new Date();
            dd.setDate(dd.getDate()+AddDayCount);//获取AddDayCount天后的日期
            var y = dd.getFullYear();
            var m = dd.getMonth()+1;//获取当前月份的日期
            var d = dd.getDate();
            return y+"-"+m+"-"+d;
        }
        datas = new Array();
        dates = new Array();
        
        $(function () {
			$('.AllHeader li:eq(1)').text('打包统计')
			
	
	//返回首页
	$(".returnhome").on('tap',function(){
		openUrl("supper.html");
	});
			
			/*遮罩*/
			$('.shadeBack').click(function(){
			$('.eject').hide();
	       	state = true;
		    });
		
		    $('.queryexit').click(function(){
			$('.eject').hide();
	       	state = true;
	    	});
			
        	
		    loadpackages();
        	
        	var RequestTime=1,page_no=1,cishu=1,intZh=1,ptinfo=1;
			$("#AllContent").scroll(function(){
		        var divHeight = $(this).height();
		        var nScrollHeight = $(this)[0].scrollHeight;
		        var nScrollTop = $(this)[0].scrollTop;
		        var xiami = nScrollTop + divHeight;
		        if(nScrollTop + divHeight >= nScrollHeight) {
		            	
		            if(page_no == 1){
		            	var Pages = 2;
		            }else{
		            	Pages = ++page_no
		            }
		            
		            if(RequestTime == cishu){
		        		$('#datalist').append("<img id='LoadingImg1' style='borderTop:3px solid #f3f3f3;width: 20%;margin:0px auto;display: block;' src='images/loading5.gif'><p style='text-align:center;color:#777;padding:0px 0px;'>正在加载...</p>");
						//$(this).animate({scrollTop:xiami},800);
						RequestTime++;
		        		$.ajax({
					        type: "GET",
					        url: getServerUrl() + "/Open/Comtag/packagestat", //与此php页面沟通
					        dataType: 'json', //从php返回的值以 JSON方式 解释
					        data: 'access_token='+getToken()+'&page_no='+Pages, //
					        success: function (json) {//如果调用php成功
					        	if (json.result == "1") {
					        		var ZLength = json.total_results/20;
			       	 				var Strlength = ZLength.toString();
			       	 				intZh = Math.ceil(Strlength);
			       	 				if(intZh == 1){
			       	 				    intZh++;
			       	 				}
			       	 				if(intZh == Pages){
			       	 				RequestTime = 0;
					            	$('#LoadingImg1').next().remove();
					    		    $('#LoadingImg1').remove();
					    		    return;				            	
						            }else{
					        		var packlist = json.packlist;
			                    	UpwardRefresh(packlist);
			                    	showpage(json.total_results,json.page_no,json.page_size,getwindowhref());
			       	 				page_no = json.page_no;
			       	 				cishu = json.page_no;
						            }
			                    } else {
			                        alert("查询数据异常");
			                    }
					        },
					        error:function(json){
					            //alertMessage(json.errordescription);
					        }
						});
		        	}else if(RequestTime == 0){
		        		if(ptinfo == 1){
		        			$('#datalist').append("<img id='LoadingImg1' style='borderTop:3px solid #f3f3f3;width: 20%;margin:0px auto;display: block;' src='images/loading5.gif'><p style='text-align:center;color:#777;padding:0px 0px;'>正在加载...</p>");
							$(this).animate({scrollTop:xiami},800);
		        			
		        			setTimeout(function () {
		        				$('#LoadingImg1').attr('src','images/loading5_.jpg');
		        				$('#LoadingImg1').next().text('没有更多数据...');
						    }, 1500);
		        			
		        			setTimeout(function () {
							    $('#LoadingImg1').next().hide(500);
							    $('#LoadingImg1').hide(500);
						    }, 2500);
		        			
		        			ptinfo++;
		        		}
		        	}
		            
		        }
			});
        	
        	
        });
        
        function loadpackages(){
		var myChart = echarts.init(document.getElementById('main'));
        	
        	document.addEventListener('deviceready', onDeviceReady, true);
        	
            $.ajax({
                type: "post",
                url:getServerUrl()+"/Open/Comtag/packagestat",
                dataType: 'json',
                data:'access_token='+getToken(),
                success: function (json) {
                    if (json.result == "1") {
                        var clist = json.data;
                        var packlist = json.packlist;
                        if (!empty(clist)) {
                            for (var i = 0; i < clist.length; i++) {
                                if (!empty(clist[i])) {
                                    //datts.push(clist[i].d);
                                    datas.push(clist[i].num);
                                }
                            }
                        }
                        var chtml = ''
                        	$('#LoadingImg').hide();
                            if (!empty(packlist)) {
                                for (var i = 0; i < packlist.length; i++) {
                                    if (!empty(packlist[i])) {
                                	chtml = chtml +'<ul onclick="detail(\'' + packlist[i].pkg_no+ '\');">'
                                	              +'<li style="width:35%;">' + packlist[i].pkg_no+ '</li>'
												  +'<li style="width:20%;color:green;text-decoration:underline;">' + packlist[i].qty + '</li>'
												  +'<li style="width:43%;">' + packlist[i].created + '</li>'
												  +'</ul>';
                                }
                            }
                        }
                        $("#datalist").html(chtml);
                        $("#pack_total").html(json.total_results);
                        
                        option = {
						    tooltip: {
						        trigger: 'axis'
						    },
						    grid: {
						        left: '3%',
						        right: '4%',
						        bottom: '3%',
						        containLabel: true
						    },
						    xAxis: {
						        type : 'category',
                                boundaryGap : false,
                                data : [
                                        GetDateStr(-7),
                                        GetDateStr(-6),
                                        GetDateStr(-5),
                                        GetDateStr(-4),
                                        GetDateStr(-3),
                                        GetDateStr(-2),
                                        GetDateStr(-1)
                                    ]
						    },
						    yAxis: {
						        type: 'value'
						    },
						    series: [
						    	{
                                    name:'打包数',
                                    type:'line',
                                    stack: '总量',
                                    data:datas
                                }
						    ]
						};
			        	myChart.setOption(option);
                        
                    }
                }
            });
        }
        
        function UpwardRefresh(clist) {
		    var chtml = '';
		    //var chtml = '';
		    if (!empty(clist)) {
		        for (var i = 0; i < clist.length; i++) {
		            if (!empty(clist[i])) {
		            	chtml = chtml +'<ul onclick="detail(\'' + clist[i].pkg_no+ '\');">'
      	              +'<li style="width:35%;">' + clist[i].pkg_no+ '</li>'
					  +'<li style="width:20%;color:green;text-decoration:underline;">' + clist[i].qty + '</li>'
					  +'<li style="width:43%;">' + clist[i].created + '</li>'
					  +'</ul>';
		            }
		        }
		    }
		    $('#LoadingImg1').next().remove();
		    $('#LoadingImg1').remove();
		    $("#datalist").append(chtml);
		}
        
        function detail(id){
        	$('.eject').show(0);
	        state = false;

            $(".sc_block").html('');
            data = {access_token:getToken(),pkg_no:id};
            $.ajax({
                type: "post",
                url:  getServerUrl()+"/Open/Comtag/getPackageDetail",
                dataType: 'json',
                data:data,
                success: function (json) {
                    if (json.result == "1") {
                        var taglist = json.taglist;
                        var chtml = ''
                        if (!empty(taglist)) {
                            for (var i = 0; i < taglist.length; i++) {
                                if (!empty(taglist[i])) {
                                    chtml = chtml+'<div class="StockNav">'
            			            +'<ul>'
            			            +'<li>标签编号</li><li>' + taglist[i].item_no + '</li>'
            			            +'</ul>'
            			            +'<ul>'
            			            +'<li>产品名称</li><li>'+ taglist[i].name +'</li>'
            			            +'</ul>'
            			            +'<ul>'
            			            +'<li>产品批次</li><li>'+ taglist[i].lot_no +'</li>'
            			            +'</ul>'
            			            +'<ul>'
            			            +'<li>价格</li><li style="color: #f60;">' + taglist[i].price + '</li>'
            			            +'</ul>'
            			            +'</div>';
                                }
                            }
                        }

                        $(".sc_block").append(chtml);

                    }
                }
            });
        }
        
        function onDeviceReady() {
            document.addEventListener("backbutton", onBackKeyDown, false);
        }
        function onBackKeyDown() {
            openUrl("supper.html");
        }
	</script>
</html>